﻿/*******************************
           DEFAULT
*******************************/

*
{
    margin: 0;
    padding: 0;
}

body
{
    background-color: #fff;
    font-size: .85em;
    font-family: "Segoe UI" , Verdana, Helvetica, Sans-Serif;
    overflow:hidden; 
}

.float-left
{
    float: left;
}

.float-right
{
    float: right;
}

.global
{
    height: 100%;
    width: 100%;
}
.wrapper
{
    margin: 0 auto;
    max-width: 1180px;
}

.clear
{
    clear: both;
}

.site-title
{
    color: #c8c8c8;
    font-family: Rockwell, Consolas, "Courier New" , Courier, monospace;
    font-size: 2.3em;
    margin: 0;
    max-width: 200px;
    float: left;
    margin-right: 15px;
}

.upper
{
    text-transform: uppercase;
}

.flip
{
    cursor: pointer;
}

.dropdown-toggle, .dropdown-menu > li > a
{
    cursor: pointer;
}

.adsholder
{
    text-align: center;
    margin: 1.05% 0;
}

.ad
{
    float:left;
    margin-bottom:4%;
    margin-right:3.23%;
    width:100%;
    height:auto;
}

.ad.medium
{
    max-width:220px;
    max-height:175px;  
}

.ad.small
{
    max-width:106px;
    max-height:106px;  
}

/*******************
    Modal Login
********************/

#LoginModal
{
    text-align: center;
    padding-top: 3%;
    padding-bottom: 2%;
}
#LoginModal div
{
    margin-bottom: 3%;
}

/*******************
    Contact US
*******************/

#ContactHolder
{
    padding-left:2.5%;
}

/********************
        HOME 
********************/

.sub-text
{
    color: #978d79;
}

.TurnPage
{
    display: none;
}

.nav-pills > li > a cufontext:hover
{
    color: #fff;
}

#topo
{
    padding-top: 1%;
    padding-bottom: 4.4%;
}

#topo > .float-left
{
    width: 38%;
}

#MainContent
{
    position: relative;
    background-color: #efeeef;
    clear: both;
    padding-bottom: 21.5px;
}

#index
{
    width: 100%;
    height: auto;
    max-height: 911px;
}

#banner
{
    width: 100%;
    height: 50%;
    background-size: 100%;
    background-repeat: no-repeat;
    background-image: url('/Content/Images/Banner.PNG');
    background-position: 50% 0%;
}

#TopSocial, #Footer div.wrapper #BottomSocial
{
    width: 100%;
}

#TopSocial div.Social
{
    padding-top: 1%;
    width: 9%;
    position: relative;
    left: 93.9%;
}
#TopSocial div.Social div, #Footer div.wrapper div.Social div
{
    float: left;
    margin-right: 5%;
    width: 20%;
}
#TopSocial div.Social div.face, #Footer div.wrapper div.Social div.face
{
    max-width: 10px;
    height: 100%;
}
#TopSocial div.Social div a img, #Footer div.wrapper div.Social div a img
{
    max-width: 100% !important;
    max-height: 14px;
    display: block;
}

#banner div.wrapper div.text
{
    margin-top: 5%;
    margin-bottom: 6%;
}

#banner div.wrapper div.text div
{
    text-align: right;
    background-color: #FFF;
    opacity: 0.8;
    position: relative;
    padding-right: 0.7%;
    margin-bottom: 4px;
    font-size: 1vmax;
}

#banner div.wrapper div.text div.first
{
    width: 57%;
    right: -42%;
}

#banner div.wrapper div.text div.second
{
    width: 69%;
    right: -30%;
}
#banner div.wrapper div.text div.last
{
    width: 67%;
    right: -32%;
    font-family: Georgia;
    font-size: 1.26vmax;
}

#Create
{
    position: absolute;
    width: 100%; /* height: 100%;*/
    height: 100%;
    top: 0px;
    background-color: rgb(241, 241, 241);
}

#Invite
{
    background-color: rgb(241, 241, 241);
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0px;
}

#IconMenuHome
{
    width: 70%;
    margin: 0px auto 20px 23%;
    padding-top: 1.8%;
}
#IconMenuHome > ul
{
    width: 100%;
    display: table;
    list-style: none;
    margin-left: auto;
    margin-right: auto;
}
#IconMenuHome ul li
{
    display: table-cell;
    vertical-align: middle;
}

#IconMenuHome > ul > li > div
{
    width: 30%;
    cursor: pointer;
}

#IconMenuHome ul li div.icon
{
    background-repeat: no-repeat;
    background-image: url('/Content/Images/sprite-IconMenu.png');
    background-size: 314%;
    padding-top: 30%;
    max-width: 152px;
    max-height: 152px;
}

#IconMenuHome ul.text li div
{
    width: 58%;
    font-family: Georgia;
    font-size: 1.1vmax;
    text-align: center;
    margin-left: -14%;
    cursor: auto;
}

#IconMenuHome ul.text li div.museo.create
{
    margin-left: -15.5%;
}

#IconMenuHome ul.text li div.museo.share
{
    margin-left: -54%;
}

#IconMenuHome ul.text li div.invite
{
    margin-left: -29%;
}

#IconMenuHome ul.text li div.sub-text.share
{
    margin-left: -52%;
}

#IconMenuHome ul li div.icon
{
    background-repeat: no-repeat;
    background-image: url('/Content/Images/sprite-IconMenu.png');
    background-size: 314%;
    padding-top: 30%;
    max-width: 152px;
    max-height: 152px;
}

#newIcon
{
    background-position: 0% 0%;
}


#newIcon:hover
{
    background-position: 0% 100%;
}

#inviteIcon
{
    background-position: 50% 0%;
}

#inviteIcon:hover
{
    background-position: 50% 100%;
}

#shareIcon
{
    background-position: 100% 0%;
}

#shareIcon:hover
{
    background-position: 100% 100%;
}

#Footer
{
    width: 100%;
    clear: both;
    background-color: #978d79;
    font-size: .8em;
}

#Footer div
{
    color: #e2dfda;
}

#Footer div.wrapper
{
    padding-top: 0.5%;
    padding-bottom: 0.5%;
}

#Footer div.wrapper div.company
{
    float: left;
}

#Footer div.wrapper div.Social
{
    float: left;
    width: 9%;
    position: relative;
    left: 84.8%;
}

/*****************************
        HOME ENGLISH 
*****************************/

html:lang(en) .adsholder
{
    text-align: center;
    margin: 1.96% 0;
}

html:lang(en) #IconMenuHome ul.text li div
{
    margin-left: -17%;
}

html:lang(en) #IconMenuHome ul.text li div.museo.create
{
    margin-left: -18.5%;
}

html:lang(en) #IconMenuHome ul.text li div.museo.share
{
    margin-left: -39%;
}

html:lang(en) #IconMenuHome ul.text li div.museo.invite
{
    margin-left: -77%;
}
html:lang(en) #IconMenuHome ul.text li div.invite
{
    margin-left: -72%;
}

html:lang(en) #IconMenuHome ul.text li div.sub-text.share
{
    margin-left: -39%;
}

/*********************************
    STORY CREATE / CONTRIBUTE
*********************************/
#FullContent
{
    width: 100%;
}

#LeftContent
{
    width: 75%;
    float: left;
}

#LeftContent > .LeftWrapper
{
    width:70%;
}

#FormCreate > fieldset, .form-control, #FormContribute > fieldset, .form-control
{
    font-family: Georgia;
    color: #978d79 !important;
}

#FormCreate > fieldset > p, #FormContribute> fieldset > p
{
    font-size: 1.26vmax;
}

#FormCreate > fieldset > .input-group, #FormContribute > fieldset > .input-group
{
    width: 80%;
    margin-bottom: 1%;
}
#FormCreate #btnOk, #FormContribute #btnContribute
{
    background-color: #978d79;
    border-radius: 10px;
    font-family: Helvetica;
    font-size: 1vmax;
    color: #fff;
    padding: 1% 2% 1% 2% !important;
}
#FormCreate #btnOk:hover, #FormContribute #btnContribute:hover
{
    background-color: #caa765;
}
